<template>
  <div v-swiper:mySwiper="swiperOption" class="swiper-no-swiping">
    <div class="swiper-wrapper">
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
      <div class="swiper-slide">
        <img
          src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1599242770249&di=135dffb003ad633fbd174a3593d90979&imgtype=0&src=http%3A%2F%2Fi1.go2yd.com%2Fimage.php%3Furl%3D0QZpabz0Ao"
          alt
        >
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      swiperOption: {
        loop: true,
        speed: 5000, // 匀速时间
        autoplay: {
          delay: 0,
          stopOnLastSlide: false,
          disableOnInteraction: false
        }
      }
    }
  },
  mounted () {
    console.log('Current Swiper instance object', this.mySwiper)
    // this.mySwiper.slideTo(3, 1000, false)
  }
}
</script>
<style>
.swiper-container1 {
  width: 100%;
  height: 50%;
}
.swiper-container2 {
  width: 100%;
  height: 50%;
}
.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.swiper-wrapper {
  transition-timing-function: linear !important;
}
</style>
